<template>
  <div id="chart" style="width:400px; height: 250px; margin-top: -60px;"></div>
</template>
<script>
import echarts from 'echarts'
export default {
  name: 'Chart',
  data(){
    return{
      i:0,
      oderlist:[]
    }

  },
  mounted() {
    this.$axios.get("/orders/count3").then(res=>{
      if(res.data.code == 200){
        this.oderlist = res.data.data
        this.i = this.oderlist[0]+this.oderlist[1]+this.oderlist[2]
      }
      this.initChart()
    })
  },
  methods: {
    initChart() {
      let chart = echarts.init(document.getElementById('chart'))
      let option = {
        title: {
          text: '订单总金额:'+this.i
        },
        tooltip: {
          trigger: 'axis'
        },
        legend: {
          data: ['金额']
        },
        xAxis: {
          type: 'category',
          data: ['课程订单流水', '组合订单流水', '商品订单流水']
        },
        yAxis: {
          type: 'value'
        },
        series: [
          {
            name: '销量',
            type: 'bar',
            data: this.oderlist
          }
        ]
      }
      chart.setOption(option)
    }
  }
}
</script>
